<html>
<head>
<title>GAE - Plain Factorial Calculator</title> 
<script src="http://www.google.com/jsapi"></script>
</head>
<body>
<form id="f" onsubmit="return start(this.n.value)">
  <span style="display:inline">N = </span><input id="n_input" type="text" name="n"/><span id="n_span" style="display:none"></span>
  <span id="product" style="display:none">Calculating...</span>
</form>
</body>
<script>
google.load("jquery", "1.2");
function start(n) {
  $('#n_input').css('display', 'none');
  $('#n_span').css('display', 'inline').html(n);
  $.ajax({
    url: '/clear',
    type: 'GET',
    dataType: 'text',
    success: function(result){
      calculate(n);
    }
  })
  return false;	
}

function calculate(n) {
  $('#product').css('display', 'block');
  $.ajax({
    url: '/factorial?n=' + n,
    type: 'GET',
    dataType: 'text',
    timeout: 10000,
    error: function(){
      $('#product').html('Error!');
    },
    success: function(result){
      $('#product').html(n + '! = ' + result);
    }
  });
}
</script>
</html>